<%--
  Created by IntelliJ IDEA.
  User: XTT
  Date: 2022/10/11
  Time: 14:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<!--引入 element-ui 的样式，-->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 必须先引入vue，  后使用element-ui -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<!-- 引入element 的组件库-->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<html>
<head>
    <title>ikun酒店</title>
    <link rel="icon" href="${pageContext.request.contextPath}/images/ikun1.jpeg" type="image/x-icon">
</head>
<style>
    a{
        text-decoration: none;
    }
    *{
        margin: 0;
        padding: 0;
    }
    .el-menu-demo{
        height: 60px;
    }
    #app span{
        float: left;
        color: #ffffff;
        padding-left: 200px;
        padding-top: 5px;
        font-size: 50px;
        font-family: 华文彩云;
    }
    iframe{
        border: none;
        width: 100%;
        height:652px ;
    }
</style>
<body>
    <div id="app">
        <el-menu
                :default-active="activeIndex"
                class="el-menu-demo"
                mode="horizontal"
                @select="handleSelect"
                background-color="#545c64"
                text-color="#fff"
                active-text-color="#ffd04b">
            <span>ikun</span>
                <el-menu-item index="1" style="margin-left: 550px"><a href="${pageContext.request.contextPath}/user/souye.jsp" target="myiframe">首页</a></el-menu-item>
                <el-menu-item index="2"><a href="${pageContext.request.contextPath}/user/online.jsp" target="myiframe">在线订房</a></el-menu-item>
                <el-menu-item index="3"><a href="${pageContext.request.contextPath}/user/gywm.jsp" target="myiframe">关于我们</a></el-menu-item>
                <el-menu-item index="4"><a href="${pageContext.request.contextPath}/user/lx.jsp" target="myiframe">联系方式</a></el-menu-item>
        </el-menu>
        <iframe src="${pageContext.request.contextPath}/user/souye.jsp"  name="myiframe"></iframe>
    </div>

</body>
<script>
    new Vue({
        el:'#app',
        data() {
            return {
                checked: '',
                activeIndex: '1',
            };
        },
        methods: {
            handleSelect(key, keyPath) {
                console.log(key, keyPath);
            }

        }
    })
</script>
</html>
